<template>
  <div class="container">
    <div class="choice_box">
      <div class="select_box_choice">
        <i-select :model.sync="model1" style="width:200px">
          <i-option v-for="item in cityList" :value="item.value">{{
            item.label
          }}</i-option>
        </i-select>
      </div>
      <div class="input_tittle_box_select">
        <input
          type="text"
          placeholder="请输入标题（最多37字）"
          class="tittle_choice_input"
        />
      </div>
      <div class="container">
        <div class="Icon_box_select">
          <div>
            <!-- <svg
              t="1593397262438"
              class="icon"
              viewBox="0 0 1024 1024"
              version="1.1"
              xmlns="http://www.w3.org/2000/svg"
              p-id="2392"
              width="24"
              height="24"
            >
              <path
                d="M888 127.2H136c-39.6 0-72 32.4-72 72v625.5c0 39.6 32.4 72 72 72h752c39.6 0 72-32.4 72-72V199.2c0-39.6-32.4-72-72-72z m0 697.3l-0.1 0.1H136.2l-0.1-0.1V611.7l185.6-189.8L539 691.8c12 13.6 32.2 16.2 47.2 6l160.5-108.5L888 655.8v168.7z m0-259.3l-118.1-48.7c-12.3-9.4-29.2-9.9-42-1.2L572.1 620.4 350 345.2c-6.6-7.5-16.1-11.9-26.1-12.2-10-0.3-19.7 3.7-26.7 10.8L136 508.7V199.3l0.1-0.1h751.7l0.1 0.1 0.1 365.9zM698 273c-55.7 0-101 45.3-101 101s45.3 101 101 101 101-45.3 101-101-45.3-101-101-101z m0 130c-16 0-29-13-29-29s13-29 29-29 29 13 29 29-13 29-29 29z"
                p-id="2393"
              ></path>
            </svg> -->
            <span>上传图片</span>
          </div>
        </div>
      </div>
      <div class="container">
        <div class="test_user_box">
          <input type="text" name="" class="test_use_inoput" />
        </div>
      </div>
      <div class="issue_button_select">发布</div>
    </div>
    <div class="Buttom_out"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      cityList: [
        {
          value: "beijing",
          label: "北京市",
        },
        {
          value: "shanghai",
          label: "上海市",
        },
        {
          value: "shenzhen",
          label: "深圳市",
        },
        {
          value: "hangzhou",
          label: "杭州市",
        },
        {
          value: "nanjing",
          label: "南京市",
        },
      ],
      model1: "",
    };
  },
};
</script>

<style>
.choice_box {
  margin-top: 20px;
  background: white;
  width: 100%;
  height: 550px;
}
.input_tittle_box_select {
  width: 90%;
  margin-top: 10px;
  margin-left: 5%;
  padding-bottom: 10px;
  border-bottom: 1px solid #d9d1d1;
}
.select_box_choice {
  padding: 10px;
  margin-left: 4%;
}
.tittle_choice_input {
  border: none;
  width: 100%;
  height: 34px;
}
input::-webkit-input-placeholder {
  /* color: brown; */
  font-size: 20px;
}
.Icon_box_select {
  width: 90%;
  /* height: 30px; */
  border-bottom: 1px solid #d9d1d1;
  margin-left: 5%;
  padding-top: 10px;
  padding-bottom: 10px;
}
.test_use_inoput {
  width: 90%;
  height: 300px;
  background: #f5f5f5;
  margin-left: 5%;
  margin-top: 20px;
}
.test_use_box {
  width: 90%;
  margin-left: 5%;
}
.issue_button_select {
  margin-left: 5%;
  border-radius: 2px;
  font-size: 14px;
  color: #fff;
  background-color: #c01e2f;
  line-height: 36px;
  text-align: center;
  width: 11%;
  margin-top: 20px;
}
.Buttom_out{
  width: 100%;
  height: 30PX;
}
</style>
